<template>
  <rx-dialog @cancel="cancel" :isOk="false" :okText="i18n('taskComm.withdrawCommBtn','撤销沟通')" :btnAlign="'center'">
    <a-table :columns="columns" :data-source="dataSource" :pagination="false">
      <template #bodyCell="{text, column, index, record }">
        <template v-if="column.dataIndex === 'serial'">
          {{index+1}}
        </template>
        <template v-else-if="column.dataIndex === 'assignee'">
          <rx-user-info :userId="text"></rx-user-info>
        </template>
        <template v-else-if="column.dataIndex === 'status'">
          <a-tag :color="statusMap[text].color">
            <span>{{statusMap[text].text}}</span>
          </a-tag>
        </template>
        <template v-else-if="column.dataIndex === 'updateTime'">
          <template v-if="record.status=='COMPLETED'">{{text}}</template>
        </template>
        <template v-else-if="column.dataIndex === 'remark'">
          <template v-if="record.status=='COMPLETED'">{{record.remark}}</template>
        </template>
      </template>
    </a-table>

  </rx-dialog>
</template>

<script>
    import {Util} from '@lowcode/jpaas-base-lib';
    import BpmtaskApi from "@/common/api/bpm/bpmTask";

    export default {
        name: "bpm-task-roam",
        props:{
            taskId:"",
            layerid: String,
            destroy:Function
        },

        data (){
            return {
                columns:[
                    {
                        title: this.$ti18('rxList.index','序号'),
                        dataIndex:'serial',
                        width: 60
                    },
                    {
                        title: this.i18n('flowPage.transferor','流转人'),
                        dataIndex: 'assignee',
                        width:180,
                        ellipsis:false,
                    },
                    {
                        title: this.i18n('flowPage.transTime','流转时间'),
                        dataIndex: 'createTime',
                        width:100
                    },
                    {
                        title: this.i18n('form.status','状态'),
                        dataIndex: 'status',
                        width:120,
                    },
                    {
                      title: this.i18n('flowPage.transOpinions','流转意见'),
                      dataIndex: 'remark',
                      width:100
                    }
                ],
                dataSource:[],
                statusMap: {
                    "UNHANDLE": { color: 'red', text: this.i18n('flowPage.unprocessed','未处理') },
                    "COMPLETED": { color: 'green', text: this.i18n('flowPage.processed','已处理') },
                    "HANDLE": { color: 'red', text: this.i18n('flowPage.circulation','正在流转') }
                }
            }
        },
        created(){
          this.init();
        },
        methods:{
          i18n(name,text,key){
              return this.$ti18(name,text,"bpmTask",key);
          },
          init(){
              BpmtaskApi.getRoamTasks(this.taskId).then(res=>{
                  this.dataSource=res.data;
              })
          },
          cancel(){
            Util.closeWindow(this,"cancel");
          }
        }
    }
</script>

<style scoped>

</style>
